<template>
  <div style="background-color: white;">
    <div style="margin-left: 10px;">
      <el-button type="primary"  @click="isShowAddLink=!isShowAddLink">新增游戏</el-button>
      <el-form style="margin-top: 40px" class="demo-form-inline" v-if="isShowAddLink">
        <el-row :gutter="20">
          <el-col :span="9">
            <el-form-item label="游戏名称">
              <el-input style="width: 500px"
                        placeholder="请输入内容"
                        v-model="game.gameName"
                        clearable>
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="9">
            <el-form-item label="图标地址">
              <el-upload
                  class="upload-demo"
                  drag
                  :show-file-list="true"
                  :name="this.image"
                  :on-success="handleAvatarSuccess"
                  :action="this.$config.url+'/common/imgUpload'">

                <i class="el-icon-upload"></i>
                <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
              </el-upload>
            </el-form-item>
          </el-col>
          <el-col :span="9">
          </el-col>
        </el-row>

        <el-form-item>
          <el-button
              type="success"
              size="mini"
              @click="addGame()">提交
          </el-button>
        </el-form-item>
      </el-form>

      <el-table
          :data="pageInfo"
          style="width: 1400px"
          :stripe=true
          :border=true
          height="500">
        <el-table-column
            prop="gameName"
            label="游戏名称"
            width="200">
        </el-table-column>
        <el-table-column
            prop="gameIcon"
            label="图标地址"
            width="200">
        </el-table-column>

        <el-table-column label="操作" width="200">
          <template slot-scope="scope">
            <el-button
                type="success"
                size="mini"
                @click="showUpdate(scope.row.id,scope.row.txt)">编辑（未做）
            </el-button>
          </template>
        </el-table-column>
      </el-table>

    </div>
  </div>
</template>
<script>
import {makeDate} from "../../assets/js/dateformat"

export default {
name: "playManagement",
  data() {
    return {
      image:'image',
      isShowAddLink:false,
      uploadPath:'',
      game :{
        gameName:'',
        gameIcon:''
      },
      pageInfo:[]
    }
  },
  methods: {
    handleAvatarSuccess(res, file) {
      // console.log(res);
      this.game.gameIcon = res.message;
    },
    addGame(){
      this.$ajax.post(this.$config.url+`/game/getGameSaveOrUpdate`,this.game)
      .then(res=>{
        if(res.data.status===this.$config.request_code_success){
          //保存成功
          this.$message.success("新增成功")
          this.getLinks();
        }else{
          this.$message.error(res.data.message)
        }
      })
    },
    getLinks(){
      this.$ajax.post(this.$config.url + `/game/getGameList`,{})
          .then(res => {
            if (res.data.status === this.$config.request_code_success) {
              //保存成功
              this.pageInfo=res.data.data;
            }
          })
    },

    makeDate(date) {
      return makeDate(date);
    },
    showUpdate(){

    }
  },
  created() {
      this.getLinks();
  }
}
</script>

<style scoped>

</style>